<!DOCTYPE html>
<!--默认为en，浏览器会弹出翻译，如果是中文网站就改成zh-->
<html lang="zh">
<head>
    <!--    meta 是信息标签-->
    <meta charset="UTF-8">
    <!--seo优化，便于浏览器收录-->
    <meta name="keyword" content="ONE,GO物，网上购物，交易市场，网上交易">
    <meta name="description" content="ONE-GO物，平价线上交易平台，提供各类商品交易，让大家都可以享受购物的乐趣和真正的品质购物">
    <title>ONE - GO物</title>
    <!--    添加标题图片-->
    <link rel="shortcut icon" href="/static/images/logo_i.png">
    <!--    引入layui css样式-->
    <link rel="stylesheet" href="/static/layui-v2.6.8/layui/css/layui.css">
    <!--    引入layui js样式-->
    <script src="/static/layui-v2.6.8/layui/layui.js"></script>

    <style type="text/css">
        * {
            margin: 0px;
            padding: 0px;
        }

        /*   头部样式 */
        .header .logo {
            height: 60px;
        }

        .header-content {
            /*设置为容器进行弹性布局*/
            display: flex;
            /*设置主轴（x轴）水平排列方式 两边对齐*/
            justify-content: space-between;
        }

        .header .logo-box {
            display: flex;
            justify-content: flex-start;
            /*设置侧轴（y轴）居中 查CSDN*/
            align-items: center;
        }

        /*   轮播图样式 */
        .content #banner img {
            height: 100%;
        }
    </style>
</head>
<body>
<!--头部 start-->
<div class="header">
    <div class="layui-header layui-bg-green">
        <div class="layui-container header-content">
            <!--logo start-->
            <div class="layui-logo logo-box">
                <img src="/static/images/logo_i.png" alt="ONE-GO物" class="logo">
                <h2>ONE-GO物</h2>
            </div>
            <!--logo end-->

            <!--        用户信息 start-->
            <ul class="layui-nav user-box layui-bg-green" lay-bar="disabled">
                <li class="layui-nav-item">
                    <a href="" class="layui-icon layui-icon-cart">购物车<span class="layui-badge layui-bg-red">9</span></a>
                </li>
                <li class="layui-nav-item">
                    <a href="">全部订单<span class="layui-badge-dot"></span></a>
                </li>
                <li class="layui-nav-item" lay-unselect="">
                    <a href="javascript:;"><img src="../RCzsdCq.jpg" class="layui-nav-img"></a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;">个人信息</a></dd>
                        <dd><a href="javascript:;">足迹</a></dd>
                        <!--                            hr标签显示上是水平分隔线-->
                        <hr>
                        <dd><a href="">退出</a></dd>
                    </dl>
                </li>
            </ul>
            <!--        用户信息 end-->
        </div>
    </div>
</div>
<!--头部 end-->

<!--主体 start-->
<div class="content">
    <div class="layui-container">
        <!--菜单 start-->
        <div class="menu"></div>
        <!--菜单 end-->

        <!--banner start-->
        <div class="layui-carousel" id="banner">
            <div carousel-item="">
                <div><img src="../static/images/1.png"></div>
                <div><img src="../static/images/2.png"></div>
                <div><img src="../static/images/3.png"></div>
                <div><img src="../static/images/4.png"></div>
                <div><img src="../static/images/5.png"></div>
                <div><img src="../static/images/6.png"></div>
                <div><img src="../static/images/7.png"></div>
            </div>
        </div>
        <!--banner end-->
    </div>
</div>
<!--主体 end-->

<!--尾部 start-->
<div class="footer"></div>
<!--尾部 end-->

<script>
    layui.use(['layer','carousel', 'form'], function () {
        var layer = layui.layer
            ,carousel = layui.carousel
            , form = layui.form;

        carousel.render({
            elem: '#banner'
            , width: '778px'
            , height: '440px'
            , interval: 5000
        });
    });
</script>
</body>
</html>